  <p style="margin-bottom: 0px">&nbsp;</p>
  <!-- <button style = "margin-top: 8px" *ngIf="authMenuBtn" nz-button nzType="default" type="button" (click)="authorizeSelect()">权限下放</button> -->
  <div nz-row [nzGutter]="16" >
    <div nz-col [nzMd]="8">
      <div style=" max-height: 800px; overflow: auto">
        <nz-card>
          <div *ngIf="!nodes || nodes.length == 0" style="margin: 0 auto; width: 100%; text-align: center">无数据</div>
          <nz-input-group *ngIf="nodes && nodes.length > 0" [nzSuffix]="suffixIcon">
            <input type="text" nz-input placeholder="输入关键字进行过滤" [(ngModel)]="searchValue">
          </nz-input-group>
          <nz-tree
            [nzSearchValue]="searchValue"
            (nzOnSearchNode)="mouseAction('search',  $event)"
            [(ngModel)]="nodes"
            [nzShowLine]="false"
            [nzDraggable]="false"
            [nzDefaultExpandAll]="true"
            (nzExpandChange)="mouseAction('expand', $event)"
            (nzClick)="mouseAction('click', $event)"
            (nzOnDragStart)="mouseAction('dragstart', $event)"
            (nzOnDragEnter)="mouseAction('enter', $event)"
            (nzOnDragLeave)="mouseAction('leave', $event)"
            (nzOnDrop)="mouseAction('drop', $event)"
            (nzOnDragEnd)="mouseAction('end', $event)"
            (nzContextMenu)="contextMenu($event, contextTemplate)"
            >
            <ng-template #contextTemplate>
                <ul nz-menu nzInDropDown>              
                    <li nz-menu-item (click)="add()"><i class="anticon anticon-plus"></i>添加角色</li>          
                    <li nz-menu-item (click)="edit()"><i class="anticon anticon-edit"></i>修改角色</li>
                    <li nz-menu-item (click)="del()"><i class="anticon anticon-delete"></i>删除角色</li>
                    <li nz-menu-item (click)="authSelect()"><i class="anticon anticon-share-alt"></i>权限分配</li>
                </ul>
            </ng-template>
          </nz-tree>
        </nz-card>
      </div>
    </div>

    <div nz-col [nzMd]="16">
      <nz-card>
        <form nz-form [formGroup]="groupForm" (ngSubmit)="doEdit()" >
          <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="name" nzRequired>名称</nz-form-label>
            <nz-form-control [nzSm]="14" [nzXs]="24">
              <input nz-input formControlName="name" id="name">
            </nz-form-control>
          </nz-form-item>
          <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="code" nzRequired>编码</nz-form-label>
            <nz-form-control [nzSm]="14" [nzXs]="24">
              <input nz-input formControlName="code" id="code">
            </nz-form-control>
          </nz-form-item>

          <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzFor="description">描述</nz-form-label>
            <nz-form-control [nzSm]="14" [nzXs]="24">
              <input nz-input formControlName="description" id="description">
            </nz-form-control>
          </nz-form-item>

          <nz-form-item nz-row style="margin-bottom:8px;" *ngIf="editStatus">
            <nz-form-control [nzSpan]="14" [nzOffset]="6">
              <button *ngIf="formStatus=='update' && editBtn" nz-button [nzLoading]='loading' nzType="primary" type="submit">更新</button>
              <button *ngIf="formStatus=='create' && addBtn" nz-button [nzLoading]='loading' nzType="primary" type="submit">保存</button>
              <button nz-button (click)='cancel()'>取消</button>
            </nz-form-control>
          </nz-form-item>
        </form>
      </nz-card>

      <nz-card *ngIf="showMember">  
          <button type="button" (click)="openUserDialog()" nz-button nzType="default"><i class="anticon anticon-plus"></i>添加客户</button>        
          <button type="button" (click)="openUserDialog2()" nz-button nzType="default"><i class="anticon anticon-plus"></i>添加用户</button>        
          <simple-table #st
              style="margin-top: 8px;"
              [columns]="columns"
              [data]="url"
              [ps]="ps"
              [extraParams]="q"
              [resReName]="{ total: 'data.total', list: 'data.rows' }"
              [reqReName]="{ pi:'pageNumber', ps: 'pageSize' }"
              toTopInChange
              [showTotal]="true"
              [showPagination]="true"
              [scroll]="{x: '600px'}"
              >
          </simple-table>
      </nz-card>
    </div>
  </div>


<ng-template #suffixIcon>
  <i class="anticon anticon-search"></i>
</ng-template>
